<%@ page import="java.util.Hashtable" %>
<%@ page import="fr.mywiki.business.entry.meta.datatype.text.SimpleText" %>
<%@ page import="fr.mywiki.business.entry.meta.datatype.text.WikiText" %>
<%@ page import="fr.mywiki.business.entry.meta.datatype.number.IntNumber" %>
<%@ page import="fr.mywiki.business.entry.meta.datatype.number.RealNumber" %>
<%@ page import="fr.mywiki.business.entry.meta.datatype.DateProperty" %>
<%@ page import="fr.mywiki.business.entry.meta.datatype.Choice" %>

<html:hidden name="editModelForm" property="propertyAction"/>
<html:hidden name="editModelForm" property="editedName"/>
<html:hidden name="editModelForm" property="editedType"/>
<html:hidden name="editModelForm" property="editedRequired"/>

<html:hidden name="editModelForm" property="editedUseMinValue"/>
<html:hidden name="editModelForm" property="editedUseMaxValue"/>
<html:hidden name="editModelForm" property="editedMinValue"/>
<html:hidden name="editModelForm" property="editedMaxValue"/>

<html:hidden name="editModelForm" property="searchString"/>

<script language="JavaScript" src="javascript/CalendarPopup.js"></script>
<!--<script language="JavaScript" src="javascript/PopupWindow.js"></script>
<script language="JavaScript" src="javascript/AnchorPosition.js"></script>
<script language="JavaScript" src="javascript/date.js"></script>-->

<script language="JavaScript">
<!--

var calMin = new CalendarPopup();
var calMax = new CalendarPopup();

function showLayer(whichLayer) {
	if (document.getElementById) {
		// this is the way the standards work
		document.getElementById(whichLayer).style.display = "block";
	} else if (document.all) {
		// this is the way old msie versions work
		document.all[whichLayer].style.display = "block";
	} else if (document.layers)	{
		// this is the way nn4 works
		document.layers[whichLayer].style.display = "block";
	}
}

function hideLayer(whichLayer) {
	if (document.getElementById) {
		// this is the way the standards work
		document.getElementById(whichLayer).style.display = "none";
	} else if (document.all) {
		// this is the way old msie versions work
		document.all[whichLayer].style.display = "none";
	} else if (document.layers)	{
		// this is the way nn4 works
		document.layers[whichLayer].style.display = "none";
	}
}

function updatePropertyType() {
	var type = document.getElementById('typeInput').value;
	
	if (type == "<%=SimpleText.TYPE_NAME%>") {
		hideLayer('minValueDiv');
		showLayer('maxValueDiv');
		hideLayer('potentialsDiv');
		document.getElementById('maxInputTitle').innerHTML = "<bean:message key="model.type.simpleText.maximal.value"/>";
		//hideLayer('minDateDiv');
		//hideLayer('maxDateDiv');
	} else if (type == "<%=WikiText.TYPE_NAME%>") {
		hideLayer('minValueDiv');
		hideLayer('maxValueDiv');
		hideLayer('potentialsDiv');
		//hideLayer('minDateDiv');
		//hideLayer('maxDateDiv');
	} else if (type == "<%=IntNumber.TYPE_NAME%>") {
		showLayer('minValueDiv');
		showLayer('maxValueDiv');
		hideLayer('potentialsDiv');
		document.getElementById('minInputTitle').innerHTML = "<bean:message key="model.type.intNumber.minimal.value"/>";
		document.getElementById('maxInputTitle').innerHTML = "<bean:message key="model.type.intNumber.maximal.value"/>";
		//hideLayer('minDateDiv');
		//hideLayer('maxDateDiv');
	} else if (type == "<%=RealNumber.TYPE_NAME%>") {
		showLayer('minValueDiv');
		showLayer('maxValueDiv');
		hideLayer('potentialsDiv');
		document.getElementById('minInputTitle').innerHTML = "<bean:message key="model.type.realNumber.minimal.value"/>";
		document.getElementById('maxInputTitle').innerHTML = "<bean:message key="model.type.realNumber.maximal.value"/>";
		//hideLayer('minDateDiv');
		//hideLayer('maxDateDiv');
	} else if (type == "<%=DateProperty.TYPE_NAME%>") {
		showLayer('minValueDiv');
		showLayer('maxValueDiv');
		hideLayer('potentialsDiv');
		document.getElementById('minInputTitle').innerHTML = "<bean:message key="model.type.date.minimal.value"/>";
		document.getElementById('maxInputTitle').innerHTML = "<bean:message key="model.type.date.maximal.value"/>";
		//hideLayer('minDateDiv');
		//hideLayer('maxDateDiv');
	} else if (type == "<%=Choice.TYPE_NAME%>") {
		showLayer('minValueDiv');
		showLayer('maxValueDiv');
		showLayer('potentialsDiv');
		document.getElementById('minInputTitle').innerHTML = "<bean:message key="model.type.choice.minimal.value"/>";
		document.getElementById('maxInputTitle').innerHTML = "<bean:message key="model.type.choice.maximal.value"/>";
		//hideLayer('minDateDiv');
		//hideLayer('maxDateDiv');
	} else {
		hideLayer('minValueDiv');
		hideLayer('maxValueDiv');
		hideLayer('potentialsDiv');
		//hideLayer('maxDateDiv');
		//hideLayer('minDateDiv');
	}
}

function addPotential() {
	document.forms["editModelForm"].method.value='addPotential';
	document.forms["editModelForm"].searchString.value=document.forms["editModelForm"].newPotentialInput.value;
	dojo.xhrPost( {
		url: "editModel.do",
		handleAs: "text",
		timeout: 5000,
		form: document.editModelForm,
		load: function(response, ioArgs) {
			dijit.byId('potentialsString').innerHTML = response;
			return response;
		},
		error: function(response, ioArgs) {
			console.error("HTTP status code: ", ioArgs.xhr.status);
			return response;
		}
	});
}

function openCal(inputObjName, anchor) {
	calMin.select(dijit.byId(inputObjName), anchor,'MM/dd/yyyy');
	return false;
}
-->
</script>

<div dojoType="dijit.Dialog" id="dialogEdition" closeScript="dijit.byId('dialogEdition').hide()"
		title="<bean:message key="model.property.edition"/>"
		closeTitle="<bean:message key="action.close"/>">
	<p class="error" id="errorEdition"></p>

	<!-- Name -->
	<p>
		<bean:message key="model.property.name"/> : <input type=text id="nameInput"/>
	</p>
	
	<!-- Type -->
	<p>
		<select id="typeInput" onchange="javascript:updatePropertyType()">
			<option value=""/>
<%
	Iterator itDataTypes = editModelForm.getDataTypes().iterator();
	while (itDataTypes.hasNext()) {
		Hashtable table = (Hashtable) itDataTypes.next();
%>
			<option value="<%=table.get("id")%>">
				<%=table.get("name")%>
			</option>
<%	
	}
%>
		</select>
	</p>	
	
	<!-- Specifications -->
	<p id="minValueDiv">
		<input type=checkbox id="useMinInput"/>
		<span id="minInputTitle"></span>&nbsp;:&nbsp;
		<input type=text id="minValInput" name="minValInput"/>
		
		<a href="#" onClick="openCal('minValInput','minDateLink');"
				title="calMin.select(document.forms['editModelForm'].minValInput,'minDateLink','MM/dd/yyyy'); return false;"
				name="minDateLink" id="minDateLink">
			<bean:message key="action.select"/>
		</a>
	</p>
	<p id="maxValueDiv">
		<input type=checkbox id="useMaxInput"/>
		<span id="maxInputTitle"></span>&nbsp;:&nbsp;
		<input type=text id="maxValInput" name="maxValInput"/>
		
		<a href="#" onClick="openCal('maxValInput','maxDateLink');"
				title="calMax.select(document.forms['editModelForm'].maxValInput,'maxDateLink','MM/dd/yyyy'); return false;"
				name="maxDateLink" id="maxDateLink">
			<bean:message key="action.select"/>
		</a>
		
	</p>
	<p id="potentialsDiv">
		<bean:message key="model.property.potentials"/> : <span id="potentialsString"></span>
		<input type=text name="newPotentialInput"/>
		<a href="javascript:addPotential()">
			<bean:message key="action.add"/>
		</a>
	</p>
	
	<!-- Required -->
	<p>
		<bean:message key="model.property.required"/>&nbsp;<input type=checkbox id="requiredInput"/>
	</p>
	
	<div class="buttonPosition">
		<html:button property="actionSubmit" onclick="javascript:validateProperty();">
			<bean:message key="action.validate"/>
		</html:button>
		<html:button property="actionSubmit" onclick="dijit.byId('dialogEdition').hide()">
			<bean:message key="action.cancel"/>
		</html:button>
	</div>
</div>